@function pxToRem($val) {
    @return $val/100 + rem;
}
.mainContent {
    width: 100%;
    height: calc(100% - 80px);
    display: flex;
    justify-content: space-between;
    // background: #f5f5f5;
    .content {
        flex: 1;
        height: 100%;
        overflow: hidden;
        padding: 20px;
        box-sizing: border-box;
        .search {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-radius: 10px;
            background:#fff;
            padding: 20px;
            box-sizing: border-box;
            // &.searchBox{
            //     justify-content: flex-start;
            //     flex-wrap: wrap;
            //     padding: pxToRem(15) pxToRem(20);
            //     padding-top: 0;
            //     .list{
            //         margin-right: pxToRem(50);
            //         span{
            //             &:first-of-type{
            //                 color: #373D41;
            //                 font-family: MicrosoftYaHeiLight;
            //             }
            //         }
            //         .el-button--primary.is-plain:focus, .el-button--primary.is-plain:hover{
            //             background-color: #1891ff;
            //         }
                    
            //     }
            // }
            .left{
                width: 50%;
                /deep/ .ivu-tabs-bar{
                    width: 100%;
                    margin: 0 auto;
                    border: none;
                }
                /deep/ .ivu-tabs-tab{
                    padding-bottom: 19px;
                    box-sizing: border-box;
                }
            }
            .right{
                margin-top: -19px;
            }
            
            .list{
                display: flex;
                justify-content: flex-start;
                align-items: center;
                // margin-right: pxToRem(20);
                // margin-top: pxToRem(20);
                span{
                    width: 90px;
                }
            }
        }
        .tabBox{
            width:100%;
            margin:20px auto 0;
            background-color: #fff;
            border-radius: 10px;
            padding: 20px;
            box-sizing: border-box;
            .down{
                width: 96%;
                display: flex;
                height: 100%;
                justify-content: space-between;
                align-items: center;
                padding: 30px 0;
                box-sizing: border-box;
                margin: auto;
            }
            .boxList{
                width: 100%;
                display: flex;
                height: 100%;
                justify-content: space-between;
                align-items: center;
                padding: 20px;
                box-sizing: border-box;
                .item{
                      width: 160px;
                      height: 110px;
                      background: #FCFDFF;
                      display: flex;
                      justify-content: space-between;
                      align-items: center;
                      border: 1px solid #1891ff;
                      padding: 30px 10px;
                      box-sizing: border-box;
                      cursor: pointer;
                      &:hover {
                            transform: scale( 1.05);
                            transition: all 1s;
                            box-shadow: 0 4px 8px rgba(46,104,253,.12);
                        }
                      &.machRuleType{
                          background-color: #eee;
                          color: #fff;
                      }
                    .left{
                        width: 50px;
                        height: 50px;
                        margin-right: 10px;
                        img{
                            display: block;
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .right{
                          flex: 1;
                        .p{
                          width: 80px;
                          font-weight: 500;
                          letter-spacing: 2px;
                          font-size: 14px;
                          font-family: Microsoft YaHei;
                          font-weight: 400;
                          color: #181818;
                          overflow: hidden;
                          text-overflow: ellipsis;
                          white-space: nowrap;
                          &:last-of-type{
                            display: flex;
                            justify-content: flex-start;
                            align-items: center;
                          }
                          .num{
                              font-size: 24px;
                          }
                      }
                    }
                    
                }
            }
            .tableList{
                width: 100%;
                margin: auto;

                /deep/ .el-table{
                    color: #181818;
                    font-family: MicrosoftYaHei;
                    font-size: 14px;
                    td, 
                    th.is-leaf{
                        border-bottom: none;
                    }
                    tr{
                        border: none;
                    }
                    // thead th{
                    //     background-color: #E5ECFD !important;
                    //     color: #1891ff;
                    //     font-weight: 400;
                    // }
                }
                /deep/ .el-table__row{
                    background-color: #fff;
                    cursor: pointer;
                }
                /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td{
                    background-color: #F3F6FD ;
                    cursor: pointer;
                }
            }
        }
    }
    /deep/ .ivu-input:hover {
        border-color: #1891ff;
    }
    /deep/ .ivu-select-visible .ivu-select-selection{
        border-color:  #1891ff !important;
    }
    /deep/ .ivu-select-selection:hover{
        border-color:  #1891ff !important;
    }
    /deep/ .ivu-tabs-ink-bar{
        background-color: #1891ff !important;
    }
    /deep/ .ivu-tabs-nav .ivu-tabs-tab-active{
        color: #1891ff !important;
    }
    /deep/ .ivu-tabs-tab:hover{
        color: #1891ff !important;
    }
    /deep/ .ivu-page-item:hover{
        border-color: #1891ff !important;
        color: #2005ff !important;
    }
    /deep/ .ivu-page-next:hover,
    /deep/ .ivu-page-prev:hover {
        border-color: #1891ff !important;
        color: #2005ff !important;
    }

    /deep/ .ivu-page-item-active{
        border-color: #1891ff !important;
    }
    /deep/ .ivu-page-options-elevator input:focus{
        border-color: #1891ff !important;
    }
    /deep/ .ivu-page-options-elevator:hover  input{
        border-color: #1891ff !important;
    }
}
